﻿<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes"/>
    <title>MCSS语音客服</title>
    <script type="text/javascript" src="../../js/frame/browser.js"></script>
    <style>

        ::-webkit-scrollbar {
            display: none
        }

    </style>
    <link href="../../css/768_1366/global.css" rel="stylesheet"/>
    <link href="../../css/768_1366/common.css" rel="stylesheet"/>
    <link type="text/css" rel="stylesheet" href="../../css/768_1366/main.css">
    <style type="text/css">
        .pt-page {
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
            visibility: hidden;
            overflow: hidden;
            backface-visibility: hidden;
            transform: translate3d(0, 0, 0);
            transform-style: preserve-3d;
        }

        .pt-page-current {
            visibility: visible;
            z-index: 1;
        }

        .pt-perspective {
            /*position: relative;*/
            width: 768px;
            height: 1366px;
            perspective: 1200px;
        }
    </style>
</head>

<body>
<div class="pt-perspective">
    <div id="wrapper" class="pt-page-current pt-page">
        <div class="container inner_main">
            <div class="header">
                <div class="logo"><em class="_devName"></em></div>
                <div class="hotline"><p>客服热线(customer service)</p>
                    <p class="_telephone"></p></div>
            </div>
            <div class="mainwrap">
                <div class="msglist" id="msglist">
                </div>
                <script id="msgItem" type="text/x-handlebars-template">
                    {{#each msgList}}
                    <div class="msgwrap {{#if cus}}customer{{/if}}" {{#if hidden}} style="display:none"
                         id="div{{spanId}}" {{/if }}>
                    <div class="dialog">
                        <div class="msgtext" {{#if spanId}} id="{{spanId}}" {{/if}}>
                        {{{text}}}
                        {{#if next}}
                        <strong class="intentStrong">
                            {{#each next}}
                            <button class="intentButton" next="{{json this}}" onclick="preDoIntent(this);">
                                {{buttonName}}
                            </button>
                            {{/each}}
                        </strong>
                        {{/if}}
                        {{#if route}}
                        {{{route}}}
                        {{/if}}
                    </div>
                    </div>
                    <div class="headicon {{#if cus}}customer{{else}}system{{/if}}">
                        <img
                                src="../../images/{{#if cus}}me{{else}}logoszt{{/if}}.png"
                                width="{{#if cus}}72{{else}}60{{/if}}" height="{{#if cus}}72{{else}}60{{/if}}" alt="">
                    </div>
                    </div>
                    {{/each}}
                </script>
            </div>

            <div class="side">
            </div>
            <div id="recorder" class="record" style="margin-top: 10px">
                <img src="../../images/apple_siri_motion_animation.gif"/>
<!--                <img src="../../images/voicebtn.png"/>-->
            </div>
            <div id="siri" class="siriwave" style="display: none">
            </div>
        </div>
<!--        <div id="countDownDiv" class="countDowndiv" style="display: block;">按住说话</div>-->
        <div class="footer mainfooter" id="goback">
            <p>退出</p>
        </div>

        <div id="screen" class="pt-page"
             style=" background:-webkit-gradient(linear, 0% 0%, 0% 100%,from(#7ab7f8), to(#d9e7f8));width: 100%;	height: 100%;	left:0;	top:0;	position:fixed!important;position:absolute;vertical-align:middle;">
            <img src="../../images/768_1366/screen_protect_768.png" style="display: block;margin: auto;">
        </div>
    </div>
</div>
</body>
<script src="../../js/frame/voice-control.js"></script>
<script src="../../js/biz/_main_js.js"></script>
<script src="../../js/biz/_main.js"></script>
<script>

    $("#goback").click(PageForward.toMain);

</script>
</html>
